<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 引入 -->
    <link rel="stylesheet" href="../css/pagination.css">
    <script src="../js/jquery-1.10.1.min.js"></script>
    <script src="../js/jquery.pagination.js"></script>
</head>

<body>
    <div class="demo"></div>
</body>
<script>
    // 优化
    // 1. 样式优化
    // 2. 分页页码范围  
    // 3. 默认添加 m-style


    $(".demo").pagination({
        totalData: 400,
        showData: 10,
        current: 1,
        mode: "fixed",
        count: 4,

        coping: true,
        homePage: '首页', //首页节点内容
        endPage: '尾页', //尾页节点内容

        prevContent: '上一页', //上一页内容
        nextContent: '下一页', //下一页内容

        isHide: true,
        jump: true, //跳转到指定页数
        jumpBtn: 'Go', //跳转按钮文本

        callback: function (api) {  // 页码改变回调
            console.log(api); // 得到一个当前分页的实例化对象
            console.log(api.getCurrent());  //获取当前页码
        }
    })


</script>

</html>